<template>
  <el-card class="m-b-20">
    <sign-pad v-if="initialized" ref="signPad" :value="signature" @input="save" />
  </el-card>
</template>

<script>
import { userLoad, userUpdate } from '@/api/system/user'
import SignPad from '@/components/Form/SignPad'

export default {
  name: 'UserSign',
  components: { SignPad },
  props: {
    user: {
      type: Object,
      default: () => {
        return {
          userId: undefined,
          signature: undefined
        }
      }
    }
  },
  data() {
    return {
      width: 0,
      height: 0,
      lastX: 0,
      lastY: 0,
      initialized: false,
      signature: ''
    }
  },
  mounted() {
    this.loadForm()
  },
  methods: {
    loadForm() {
      this.signature = ''
      userLoad({
        id: this.user.userId
      }).then(response => {
        if (response.param.signature) {
          this.signature = response.param.signature
        }
        this.initialized = true
      }).catch(() => {})
    },
    save(blob) {
      userUpdate({
        userId: this.user.userId,
        signature: blob
      }).then(response => {
        this.$modal.msgSuccess(response.msg)
      }).catch(() => {})
    }
  }
}
</script>
